<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-spring4-4.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org" >
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<script type="text/javascript" th:src="@{../jquery-2.1.4.min.js}"></script>
<script type="text/javascript" th:src="@{../bootstrap-3.3.7-dist/js/bootstrap.min.js}"></script>
<link type="text/css" rel="stylesheet" th:href="@{/bootstrap-3.3.7-dist/css/bootstrap.min.css}">
<script type="text/javascript" th:src="@{../bootstrap-treeview/bootstrap-treeview.min.js}"></script>
<link type="text/css" rel="stylesheet" th:href="@{../bootstrap-treeview/bootstrap-treeview.min.css}">
<script type="text/javascript" th:src="@{../bootStrap-addTabs/bootstrap.addtabs.min.js}"></script>
<link type="text/css" rel="stylesheet" th:href="@{../bootStrap-addTabs/bootstrap.addtabs.css}">
<script type="text/javascript" th:src="@{../bootstrap-table/bootstrap-table.min.js}"></script>
<script type="text/javascript" th:src="@{../bootstrap-table/locale/bootstrap-table-zh-CN.min.js}"></script>
<link type="text/css" rel="stylesheet" th:href="@{../bootstrap-table/bootstrap-table.min.css}">

<script type="text/javascript" th:src="@{../bootstrap-fileinput/js/fileinput.min.js}"></script>
<script th:src="@{../bootstrap-fileinput/js/locales/zh.js}"></script>
<!--弹窗css-->
<link href="https://cdn.bootcss.com/toastr.js/2.1.4/toastr.min.css" rel="stylesheet" type="text/css" />
<script src="https://cdn.bootcss.com/toastr.js/2.1.4/toastr.min.js"></script>
<body>
<div id="tb">

    <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addLayer">添加记录</button>
    <button type="button" class="btn btn-primary" data-toggle="modal" onclick="fan()">返回</button>

</div>
<table id="myTable"></table>

<!-- 修改 -->
<div class="modal fade" id="editLayer" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">

                <button data-dismiss="modal" class="close" type="button"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>

                <h4 class="modal-title">修改记录</h4>

            </div>
            <!--===================================================================================  -->
            <div class="modal-body">
                <form id="myForm1" class="form-horizontal">
                    <input type="hidden" id="tid" class="form-control" name="tid"> <br>


                    类型:<input type="text" class="form-control" name="t_lei" id="t_lei">

                </form>
            </div>
            <!--===================================================================================  -->
            <div class="modal-footer">
                <button data-dismiss="modal" class="btn btn-default" type="button">关闭</button>
                <button class="btn btn-primary" type="button" onclick="update()">确认修改</button>
            </div>

        </div>
    </div>
</div>


<!--记录添加弹出层 -->
<div class="modal fade" id="addLayer" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">

                <button data-dismiss="modal" class="close" type="button"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title">添加记录</h4>

            </div>
            <!--=========================================================================================  -->
            <div class="modal-body">
                <form id="myForm">
                    类型:<input type="text" class="form-control"  name="t_lei" >

                </form>
            </div>
            <!--=========================================================================================  -->
            <div class="modal-footer">
                <button data-dismiss="modal" class="btn btn-default" type="button">关闭</button>
                <button class="btn btn-primary" type="button" onclick="sub()">确认添加</button>
            </div>

        </div>
    </div>
</div>

<!--记录添加弹出层 -->
<div class="modal fade" id="addLayer1" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">

                <button data-dismiss="modal" class="close" type="button"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title">修改类型</h4>

            </div>
            <!--=========================================================================================  -->
            <div class="modal-body">
                <form id="myForm2">
                    类型:<select class="selectpicker form-control" data-live-search="true" name="lei"  id="addid2"></select>

                </form>
            </div>
            <!--=========================================================================================  -->
            <div class="modal-footer">
                <button data-dismiss="modal" class="btn btn-default" type="button">关闭</button>
                <button class="btn btn-primary" type="button" onclick="que()">确认添加</button>
            </div>

        </div>
    </div>
</div>
<!--记录添加弹出层 -->
<div class="modal fade" id="addLayer2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">

                <button data-dismiss="modal" class="close" type="button"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title">修改类型</h4>

            </div>
            <!--=========================================================================================  -->
            <div class="modal-body">
                <form   enctype="multipart/form-data" >
                    <input type="file" name="file">
                </form>
            </div>
            <!--=========================================================================================  -->
            <div class="modal-footer">
                <button data-dismiss="modal" class="btn btn-default" type="button">关闭</button>
                <button class="btn btn-primary" type="button" onclick="daoru()">确认添加</button>
            </div>

        </div>
    </div>
</div>
</body>
<script>
    $(function(){
        showSel()
        showSel1()
        showSel2()
    })
    function showSel(){
        $.ajax({
            type : 'get',
            url:"integral/getType",
            dataType : "json",
            success: function(data) {
                var opts = "";
                for( var i = 0 ; i < data.length; i++ ){
                    //id          类型
                    opts += "<option value='"+data[i].tid+"'>"+data[i].t_lei+"</option>";
                }
                // 查询界面
                $("#addid").append(opts);
            }
        });
    }

    function showSel1(){
        $.ajax({
            type : 'get',
            url:"integral/getType",
            dataType : "json",
            success: function(data) {
                var opts = "";
                for( var i = 0 ; i < data.length; i++ ){
                    //id          类型
                    opts += "<option value='"+data[i].tid+"'>"+data[i].t_lei+"</option>";
                }
                // 查询界面
                $("#addid1").append(opts);
            }
        });
    }
    function showSel2(){
        $.ajax({
            type : 'get',
            url:"integral/getType",
            dataType : "json",
            success: function(data) {
                var opts = "";
                for( var i = 0 ; i < data.length; i++ ){
                    //id          类型
                    opts += "<option value='"+data[i].tid+"'>"+data[i].t_lei+"</option>";
                }
                // 查询界面
                $("#addid2").append(opts);
            }
        });
    }
    $("#myTable").bootstrapTable({
        url:"../integral/queryGuan",
        columns:[
            {field:"xuan",checkbox:true},
            {field:"tid",title:"序号"},
            {field:"t_lei",title:"类别"},
            {field:"cxz",title:"操作",formatter:function(value,row){
                var str="";
                     str+='<button class="btn btn-info" onclick="del('+row.tid+')">删除</button>';
                    var str1='<button class="btn btn-success"  data-toggle="modal" data-target="#editLayer" onclick="getId('+row.tid+')">编辑</button>';

                    return str+"   "+str1;
                }},
        ],
        pagination:true,
        pageSize:10,
        pageList:[2,4,6,8,10],
        sidePagination: "client",
        toolbar:"#tb",
    })
    function getId(id){
        $.ajax({
            url:"integral/getGuan",
            data:{tid:id},
            type:"post",
            dataType:"json",
            success:function(data){
                $("#tid").val(data.tid);
                $("#t_lei").val(data.t_lei);


            }
        })
    }

    function update(){
        var info=confirm("是否修改?");
        if(info){
            $.ajax({
                url:"integral/updateGuan",
                type:"post",
                data:$("#myForm1").serialize(),
                dataType:"json",
                success:function(){
                    toastr.success("修改成功");
                    $('#myTable').bootstrapTable('refresh');//刷新表格
                    $("#editLayer").modal('hide');
                },error:function(){
                    toastr.success("修改成功");

                    $("#myTable").bootstrapTable('refresh');
                    $("#editLayer").modal('hide'); //关闭弹窗
                }
            })
        }else{
            toastr.success("取消了");

        }

    }

       /* function zan(id){
            var info=confirm("是否暂停?");
            if(info){
                $.ajax({
                    url:"integral/zan",
                    data:{id:id},
                    type:"post",
                    dataType:"json",
                    success:function(data){

                        toastr.success("成功了");
                        location.reload();

                    },error:function(){
                      toastr.success("成功了");
                        location.reload();

                    }
                })
            }else{
                toastr.success("取消了");
            }

    }*/
    function del(id){
        var info=confirm("是否删除?");
        if(info){
            $.ajax({
                url:"integral/delGuan",
                data:{tid:id},
                type:"post",
                dataType:"json",
                success:function(data){
                    toastr.success("成功了");
                    location.reload();

                },error:function (){
                    toastr.success("成功了");
                    location.reload();
                }
            })
        }else {
            toastr.success("取消了");
        }

    }
    function sub(){

        $.ajax({
            url:"integral/addGuan",
            type:"post",
            data:$("#myForm").serialize(),
            dataType:"json",
            success:function(){
                alert("成功")
                $('#myTable').bootstrapTable('refresh');//刷新表格
                $("#addLayer").modal('hide');
            },error:function(){
                alert("成功")
                $('#myTable').bootstrapTable('refresh');//刷新表格
                $("#addLayer").modal('hide'); //关闭弹窗
            }
        })
    }
    function poidaochu(){
         location.href="integral/poidaochu";
    }
/*
    function  jia(){
        //插入新行

        alert($('#myTable').bootstrapTable('insertRow',{index:count,row:{newFlag:"1"}}))
    }
*/
    var ids="";
    function updall(){

        var row=$.map($("#myTable").bootstrapTable('getSelections'),function(row){
            return row ;
        });

        for(var i=0;i<row.length;i++){
            ids+=ids==""?row[i].id:","+row[i].id;
        }
        if(ids==null || ids==''){
            alert("请至少选中一项")
        }else {


        }

    }
    function  que(){
        var aa=$("#addid2").val();
        $.ajax({
            url:"integral/updall",
            data:{ids:ids,lei:aa},
            success:function(){
                location.reload();
            },error:function (){
                location.reload();
            }
        })
    }
    function  daoru(){
       location.href="integral/daoru"
    }
    function  fan(){
        location.href="jiQuery.html"
    }
</script>
</html>